<#if (articleList??)>
<div id="TEMPLATE_LABEL_">
	<section id="demo4-main"  class="all-main">
		<div class="new-list-warp">
			<section class="container">
				<div class="comm-title">

					<article class="col-7 fl">
						<div class="new-list-right ml30">
							<div class="comm-title">
								<header class="clearfix">
									<h3 class="unFw hLh30 pb10">
										<#if TEMPLATE_TITLE??>
											<#list TEMPLATE_TITLE?split("/") as templateTitle>
												<#if (templateTitle_index=0)>
												<div class="fsize24 f-fM c-333 hLh40">${templateTitle!''}</div>
											</#if>
											</#list>
										</#if>
										<#if TEMPLATE_INFO??>
											<#list TEMPLATE_INFO?split("/") as templateInfo>
												<#if (templateInfo_index=0)>
													<div class="fsize12 f-fM c-assist hLh30">${templateInfo!''}</div>
												</#if>
											</#list>
										</#if>
									</h3>
								</header>
							</div>
							<div class="n-l-r-list">
								<ul class="n-l-box mt40">
									<div id="article-list-div_TEMPLATE_ID">
									</div>
								</ul>
							</div>
						</div>
					</article>

					<article class="col-3 fr">
						<div class="new-list-right ml30">
							<div class="comm-title">
								<header class="clearfix">
									<h3 class="unFw hLh30 pb10">
										<#if TEMPLATE_TITLE??>
											<#list TEMPLATE_TITLE?split("/") as templateTitle>
												<#if (templateTitle_index=1)>
												<div class="fsize24 f-fM c-333 hLh40">${templateTitle!''}</div>
												</#if>
											</#list>
										</#if>
										<#if TEMPLATE_INFO??>
											<#list TEMPLATE_INFO?split("/") as templateInfo>
												<#if (templateInfo_index=1)>
												<div class="fsize12 f-fM c-assist hLh30">${templateInfo!''}</div>
												</#if>
											</#list>
										</#if>

									</h3>
								</header>
							</div>
							<div class="n-l-r-list">
								<ul class="c-c-list">
									<#list articleList10 as articleList10>
										<#if (articleList10_index=0)>
											<li>
												<span class="order nb-1">${articleList10_index+1}</span>
												<a title="${articleList10.title}" href="${ctx}/webpage/toArticle/${articleList10.articleId}">
													<p>${articleList10.title}</p>
													<div class="i-cc-r-cimg mt10">
										<span class="fl mr10">
										<img src="/template/templet1/images/default-img.gif" xsrc="${ctx}/${articleList10.imageUrl}" alt="" width="100" height="75">
										</span>
														<div class="s-c-desc">
															<small class="fsize12 c-999">${articleList10.summary}</small>
														</div>
														<div class="tar">
															<tt class="hLh30 f-fM fsize12 c-999 disIb">
																${articleList10.publishTime?string("yyyy-MM-dd")}
															</tt>
														</div>
													</div>
												</a>
											</li>
										</#if>
										<#if (articleList10_index > 0)>
										<li>
											<#if (articleList10_index < 3)>
											<span class="order nb-${articleList10_index+1}">${articleList10_index+1}</span>
												<#else>
													<span class="order">${articleList10_index+1}</span>

											</#if>
											<a title="${articleList10.title}" href="${ctx}/webpage/toArticle/${articleList10.articleId}">
												<p>${articleList10.title}</p>
												<section class="hLh30 clearfix">
													<div class="fl">

														<em class="icon16 ico">
															<img src="/template/templet1/images/liul.png">
														</em>
														<tt class="fsize12 c-666 f-fM vam">${articleList10.clickNum}次</tt>
													</div>
													<div class="fl ml30">
														<em class="icon16 ico">
															<img src="/template/templet1/images/time.png">
														</em>
														<tt class="fsize12 c-666 f-fM vam">${articleList10.publishTime?string("yyyy-MM-dd HH:mm:ss")}</tt>
													</div>
												</section>
											</a>
										</li>
										</#if>
									</#list>
								</ul>
							</div>
						</div>
					</article>
				</div>
			</section>	


			<script>
				$(function() {
					queryPageByTEMPLATE_ID();
				});
				//查询内容
				function queryPageByTEMPLATE_ID() {
					ajaxPageMulti("/front/ajax/articlelist", 1, "TEMPLATE_ID");
				}

				/*
				 * ajax分页方法获取数据(多个共用)
				 */
				var lodingHtml = '<div class="tac"><img width="100" height="108" alt="" src="/static/mooc_web/img/loading.gif"></div>';
				function ajaxPageMulti(url,pageNum,id){
					ajaxUrl = url;
					parameters='page.currentPage='+pageNum+"&pageRequestUrl="+url+"&templateId="+id;
					$.ajax({
						type : "POST",
						dataType : "text",
						url:"${ctx}"+url,
						data : parameters,
						cache : true,
						async : true,
						beforeSend:function(){
							$("#article-list-div_"+id).html(lodingHtml);
						},
						success : function(result){
							$("#article-list-div_"+id).html(result);
							scrollLoad(); //响应滚动加载课程图片
							//$('html, body').animate({scrollLoad:0});
						}
					});
				}
			</script>
		</div>
	</section>
</div>
</#if>